<%@ Page Language="C#" MasterPageFile="~/HomePages.Master" AutoEventWireup="true" CodeBehind="MyPlaceFavorite.aspx.cs" Inherits="BusinessService.MyPlace.MyPlaceFavarite" Title="Untitled Page" %>
<asp:Content ID="Content3" ContentPlaceHolderID="head" runat="server">
  <link href="../Content/MyMap.css" rel="stylesheet" type="text/css" />
 <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>My Place</title>
<script src="../Content/PlaceSearch.js" type="text/javascript"></script>
<script src="../Content/Search.js" type="text/javascript"></script>
<script src="../Content/BusinessService.js" type="text/javascript"></script>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&libraries=places"></script>
<script src="http://www.google.com/uds/api?file=uds.js&amp;v=1.0&amp;key=ABQIAAAAjU0EJWnWPMv7oQ-jjS7dYxQ82LsCgTSsdpNEnBsExtoeJv4cdBSUkiLH6ntmAr_5O4EfjDwOa0oZBQ" type="text/javascript"></script>
 <script src="../Content/js/util.js" type="text/javascript"></script>
<script type="text/javascript">
  google.load("jquery", "1.3.2");   

  var map, places, iw;
  var markers = [];
  var autocomplete;  
  var geocoder; 
    
  var markerInsert = new google.maps.Marker();
  var infoWindowInsert = new google.maps.InfoWindow();
  
  function initialize() {
  geocoder = new google.maps.Geocoder();
    var myLatlng = new google.maps.LatLng(37.783259, -122.402708);
    var myOptions = {
      zoom: 12,
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map"), myOptions);
    places = new google.maps.places.PlacesService(map);
    google.maps.event.addListener(map, 'tilesloaded', tilesLoadForMyPlace);
    autocomplete = new google.maps.places.Autocomplete(document.getElementById('txtSearch'));
    google.maps.event.addListener(autocomplete, 'place_changed', function() {
      showSelectedPlace();
    });    

  
    google.maps.event.addListener(map, "click", function(event) {
//    document.getElementById("txtSearch").value = event.latLng.toUrlValue(6);
//    codeLatLng();
//        marker = new google.maps.Marker({
//          position: event.latLng,
//          map: map
//        });
    markerInsert.setPosition(event.latLng);
    markerInsert.setMap(map);
        
       var latLngs = event.latLng;
       var address;  
  geocoder.geocode({'latLng': latLngs}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
         if (results[1]) {
            address = results[1].formatted_address;
          }
       }
     var html = gethtml(address);
     infoWindowInsert.setPosition(latLngs);
     infoWindowInsert.setContent(html);  
    
       
    });
 
    
    google.maps.event.addListener(markerInsert, "click", function() {   
    
          infoWindowInsert.open(map, markerInsert);
        });
    });    
   
    MyPlaceFavorite();
    
    
    // Initialize the local searcher
     gLocalSearch = new GlocalSearch();
     gLocalSearch.setSearchCompleteCallback(null, OnLocalSearch);
    
  }

    
    
  function getDichVu(){
    var values = new Array();
    var names =new Array();
    var options = null;
   downloadUrl("DichVu.xml", function(data) {
      var markers = data.documentElement.getElementsByTagName("service");
      for (var i = 0; i < markers.length; i++) {
        var value = parseInt(markers[i].getAttribute("value"));
        values.push(value);
        var name = markers[i].getAttribute("name");
        names.push(name);
       }
       
       for(var index = 0; index < names.length; index ++){
        options = options + '<option value="' +values[index]+ '">' + names[index] + '</option>';
       }      
     });
     
  return options;
  }
  
  function MyPlaceFavorite(){
   jQuery.get("DiaDiems.xml", {}, function(data) {
      jQuery(data).find("marker").each(function() {       
        var marker = jQuery(this);
        
        var id = parseInt(marker.attr("id"));
        var name = marker.attr("name");
        var address = marker.attr("address");
        var description = marker.attr("description");
        var country = marker.attr("country");
        var type = marker.attr("type");
        var lat = parseFloat(marker.attr("lat"));
        var lng = parseFloat(marker.attr("lng"));
        var latlng = new google.maps.LatLng(parseFloat(marker.attr("lat")),
                                    parseFloat(marker.attr("lng")));
        var marker = new google.maps.Marker({position: latlng, map: map});
        var latLngs = marker.getPosition();             
        var infowindow = new google.maps.InfoWindow();
        geocoder.geocode({'latLng': latlng}, function(results, status) {
          if (status == google.maps.GeocoderStatus.OK) {
            if (results[1]) {
              map.setZoom(11);
              marker = new google.maps.Marker({
                  position: latlng, 
                  map: map
              }); 
           
              var html = gethtmlUpdate(id,name,address,description,type,lat,lng);
              infowindow.setContent(html);
              infowindow.setPosition(latlng);
//              infowindow.setContent(results[1].formatted_address + results[1].types);
               google.maps.event.addListener(marker, "click", function() {
              infowindow.open(map, marker);
            });
              
            } else {
              alert("No results found");
            }
          } else {
            alert("Geocoder failed due to: " + status);
          }
        });    

     });      
    });
  }
  
  function reverseLatLngToAddress(latlng)
  {
    geocoder.geocode({'latLng': latlng}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
      return "test";
         if (results[1]) {
            return results[1].formatted_address;
          }
       }
    });
    return null;
  }
  
  // reverse from LatLng to Address
  function codeLatLng() {
   var infowindow = new google.maps.InfoWindow();
   var marker;
  
    var input = document.getElementById("txtSearch").value;
    var latlngStr = input.split(",",2);
    var lat = parseFloat(latlngStr[0]);
    var lng = parseFloat(latlngStr[1]);
    var latlng = new google.maps.LatLng(lat, lng);
    geocoder.geocode({'latLng': latlng}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        if (results[1]) {
          map.setZoom(11);
          marker = new google.maps.Marker({
              position: latlng, 
              map: map
          }); 
          infowindow.setContent(results[1].formatted_address);
          infowindow.open(map, marker);
        } else {
          alert("No results found");
        }
      } else {
        alert("Geocoder failed due to: " + status);
      }
    });
  }

</script>

</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
  <!-- left -->
<div id="left">   
    <div id="myDiv"></div>
    <table id="results"></table>   
    <asp:TreeView ID="TreeView1" runat="server" ImageSet="Contacts" NodeIndent="10">
        <ParentNodeStyle Font-Bold="True" ForeColor="#5555DD" />
        <HoverNodeStyle Font-Underline="False" />
        <SelectedNodeStyle Font-Underline="True" HorizontalPadding="0px" 
            VerticalPadding="0px" />
        <NodeStyle Font-Names="Verdana" Font-Size="8pt" ForeColor="Black" 
            HorizontalPadding="5px" NodeSpacing="0px" VerticalPadding="0px" />
    </asp:TreeView>
</div>
 <!-- main map-->
<div id="map">
</div>  
</asp:Content>
